//导入全局css
import './lib/css/style.css'
import './sass/main.scss'

//导入库文件
import Vue from 'vue'
import Router from 'vue-router'

//导入前端框架
import Mint from 'mint-ui'

//导入ajax库
import axios from 'axios'

Vue.prototype.$http = axios;

//路由页面导入
import Index from './page/index.vue'
import userPayRecord from './page/userPayRecord.vue'

//导入UI库
Vue.use(Mint);

//导入路由
Vue.use(Router);

const routes = [
  { path: '/', component: Index },
  { path: '/User/payRecord/:id', component: userPayRecord}
]

//router实例
const router = new Router({
  routes // （缩写）相当于 routes: routes
});



const app = new Vue({
  el: '#app',
  data: {
    sb : 'sb, Hello',
    id : 'sbsb_id',
    transitionName : 'fade'
  },
  methods : {                   
    
  },
  router: router,
  watch: {
    '$route' (to, from) {
      const toDepth = to.path.split('/').length
      const fromDepth = from.path.split('/').length
      this.transitionName = toDepth < fromDepth ? 'slide-right' : 'slide-left';
      console.log(this.transitionName);
    }
  }
});

router.afterEach(route => {
  // ...
  var name = app.$data.transitionName;
  //app.$data.transitionName = name == 'slide-right' ? 'slide-left' : 'slide-right'
  console.log(route.path);
})